// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import Apple from './components/Apple.vue'
import Banana from './components/Banana.vue'
import RedApple from './components/RedApple.vue'

import VRouter from 'vue-router'
import Vuex from 'vuex'

Vue.config.productionTip = false

Vue.use(VRouter);
Vue.use(Vuex);

let store = new Vuex.Store({
        state:{
          totalPrice: 0
        },
        mutations:{
          increment(state,price){
            state.totalPrice += price
          },
          decrement(state,price){
            state.totalPrice -= price
          }
        },
        actions:{
            increase(context){
              context.commit('increment',price)
            }
        }
})

let router = new VRouter({
    mode: 'history',
    routes:[
      // {
      //   path:'/',
      //   redirect:'/apple'
      // },
      {
          path:'/apple',
          // component: {
          //     viewA: Apple,
          //     viewB: Banana
          // },
        component:Apple,

        children:[
              {
                path:'red',
                component:RedApple
              }

          ]
      },
      {
          path:'/banana',
          component: Banana
      }
    ]
})
/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  store,
  template: '<App/>',
  components: { App }
})
